import { DeliverLogModel } from '@/models/deliverLog'
import { getCustomerChannelList } from '@/services/CustomerChannelService'

import { useModel, useSnapshot } from '@@/exports'
import {
  ModalForm,
  ProFormDateTimePicker,
  ProFormInstance,
  ProFormSelect,
  ProFormText,
} from '@ant-design/pro-components'
import { useRef } from 'react'

export interface DeliverLogUpdateModalProps {
  onFinish: (formData: any) => Promise<boolean | void>
  isAdd: any
}

const DeliverLogUpdateModal = (props: DeliverLogUpdateModalProps) => {
  let { getDictList } = useModel('dict')
  let deliverLogState = useSnapshot(DeliverLogModel.state)
  let { actions: deliverLogActions } = DeliverLogModel

  const formRef = useRef<ProFormInstance>()
  return (
    <>
      <ModalForm
        key={deliverLogState.deliverLog?.id || -1}
        formRef={formRef}
        title={props.isAdd ? '添加投放记录' : '修改投放记录'}
        open={deliverLogState.updateModalState}
        initialValues={deliverLogState.deliverLog}
        onFinish={props.onFinish}
        onOpenChange={deliverLogActions.setUpdateModalState}
      >
        <ProFormText label="id" name="id" hidden />
        <ProFormSelect
          label="投放渠道"
          name="channelId"
          request={getCustomerChannelList}
          fieldProps={{
            fieldNames: { label: 'channelName', value: 'id' },
          }}
          rules={[{ required: true, message: '请选择领取规则' }]}
        />
        <ProFormText label="投放资金" name="fee" rules={[{ required: true, message: '请填写投放资金' }]} />
        <ProFormDateTimePicker
          label="投放时间"
          name="deliverTime"
          rules={[{ required: true, message: '请选择投放时间' }]}
        />
      </ModalForm>
    </>
  )
}

export default DeliverLogUpdateModal
